(function () {
    const arr = [0, 0, 0, 0]
    function copyCssToClipboard(str) {
        const clipboardObj = navigator.clipboard
        const message = {}
        if (clipboardObj) {
            return clipboardObj.writeText(str).then(
                () => alert('Copied to clipboard'),
                () => alert('Failed to copy'))
        }
        alert('Copied to clipboard')
    }
    $('.border').on('blur', function () {
        const index = $(this).attr("data-id")
        if (!this.value) return
        arr[index - 1] = this.value
        $('.box').css({
            "borderRadius": `${arr[0]}px ${arr[1]}px ${arr[2]}px ${arr[3]}px`
        })
    })
    $('.copy').on('click', function () {
        let str = "border-radius: "
        str += `${arr[0]}px ${arr[1]}px ${arr[2]}px ${arr[3]}px`
        copyCssToClipboard(str)
    })
})()